import 'dart:math';

import 'package:another_transformer_page_view/another_transformer_page_view.dart';
import 'package:flutter/material.dart';
import 'package:flutter_login/widget_helper.dart';

import 'CustomPageTransformer.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);


  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>with TickerProviderStateMixin {
  TransformerPageController _pageController;
  var _pageIndex = 0;
  AnimationController _formLoadingController;
  AnimationController _routeTransitionController;
  Animation<double> _flipAnimation;
  Animation<double> _cardSizeAnimation;
  Animation<double> _cardSize2AnimationX;
  Animation<double> _cardSize2AnimationY;
  Animation<double> _cardRotationAnimation;
  Animation<double> _cardOverlayHeightFactorAnimation;
  Animation<double> _cardOverlaySizeAndOpacityAnimation;
  final GlobalKey _cardKey = GlobalKey();
  static const cardSizeScaleEnd = .2;
  @override
  void initState() {
    super.initState();

    _pageController = TransformerPageController();




    _formLoadingController = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 1150),
      reverseDuration: Duration(milliseconds: 300),
    );

    _routeTransitionController = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 1100),
    );

    _cardSizeAnimation = Tween<double>(begin: 1.0, end: cardSizeScaleEnd)
        .animate(CurvedAnimation(
      parent: _routeTransitionController,
      curve: Interval(0, .27272727 /* ~300ms */, curve: Curves.easeInOutCirc),
    ));
    // replace 0 with minPositive to pass the test
    // https://github.com/flutter/flutter/issues/42527#issuecomment-575131275
    _cardOverlayHeightFactorAnimation =
        Tween<double>(begin: double.minPositive, end: 1.0)
            .animate(CurvedAnimation(
          parent: _routeTransitionController,
          curve: Interval(.27272727, .5 /* ~250ms */, curve: Curves.linear),
        ));
    _cardOverlaySizeAndOpacityAnimation =
        Tween<double>(begin: 1.0, end: 0).animate(CurvedAnimation(
          parent: _routeTransitionController,
          curve: Interval(.5, .72727272 /* ~250ms */, curve: Curves.linear),
        ));
    _cardSize2AnimationX =
        Tween<double>(begin: 1, end: 1).animate(_routeTransitionController);
    _cardSize2AnimationY =
        Tween<double>(begin: 1, end: 1).animate(_routeTransitionController);
    _cardRotationAnimation =
        Tween<double>(begin: 0, end: pi / 2).animate(CurvedAnimation(
          parent: _routeTransitionController,
          curve: Interval(.72727272, 1 /* ~300ms */, curve: Curves.easeInOutCubic),
        ));
  }

  Future<void> _forwardChangeRouteAnimation() {
    final deviceSize = MediaQuery.of(context).size;
    final cardSize = getWidgetSize(_cardKey);
    final widthRatio = deviceSize.width / cardSize.height + 1;
    final heightRatio = deviceSize.height / cardSize.width + .25;

    _cardSize2AnimationX =
        Tween<double>(begin: 1.0, end: heightRatio / cardSizeScaleEnd)
            .animate(CurvedAnimation(
          parent: _routeTransitionController,
          curve: Interval(.72727272, 1, curve: Curves.easeInOutCubic),
        ));

    return _formLoadingController
        .reverse()
        .then((_) => _routeTransitionController.forward());
  }
  @override
  void dispose() {
    _pageController.dispose();
    super.dispose();

  }

  void _switchRecovery(bool recovery) {

    if (recovery) {
      _pageController.nextPage(
        duration: Duration(milliseconds: 500),
        curve: Curves.ease,
      );
      _pageIndex = 1;
    } else {
      _pageController.previousPage(
        duration: Duration(milliseconds: 500),
        curve: Curves.ease,
      );
      _pageIndex = 0;
    }
  }
  @override
  Widget build(BuildContext context) {
    final theme = Theme.of(context);
    final deviceSize = MediaQuery.of(context).size;

    Widget current = Container(
      height: deviceSize.height,
      width: deviceSize.width,
      child: TransformerPageView(
        physics: NeverScrollableScrollPhysics(),
        pageController: _pageController,
        itemCount: 2,

        /// Need to keep track of page index because soft keyboard will
        /// make page view rebuilt
        index: _pageIndex,
        transformer: CustomPageTransformer(),
        itemBuilder: (BuildContext context, int index) {
          final child = (index == 0)
              ? Container(
            width: 300,
            height: 300,
            color: Colors.cyan,
            child: TextButton(
              child: Text("2222"),
              onPressed: (){
                setState(() {
                  _pageIndex =1;
                });
              },
            ),
          )
              : Container(
            height: 300,
            width: 400,
            color: Colors.amber,
            child: TextButton(
              child: Text("2222"),
              onPressed: (){
                setState(() {
                  _pageIndex =0;
                });
              },
            ),
          );

          return Align(
            alignment: Alignment.topCenter,
            child: child,
          );
        },
      ),
    );
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: AnimatedBuilder(
        animation: _cardSize2AnimationX,
        builder: (context, snapshot) {
          return Transform(
            alignment: Alignment.center,
            transform: Matrix4.identity()
              ..rotateZ(_cardRotationAnimation.value)
              ..scale(_cardSizeAnimation.value, _cardSizeAnimation.value)
              ..scale(_cardSize2AnimationX.value, _cardSize2AnimationY.value),
            child: current,
          );
        },
      ),
    );
  }
}
